<template>
  <div id='logo'
       @click="go_to_page01()">
    <img src='@/assets/meng/logo.png'>
    <section>
      <p><span>掌上精选</span><span v-if="show"><span>抖</span><span class="mt">音</span><span>版</span></span></p>
      <p :class="{l_s:!show}">dy.zsjx114.com</p>
    </section>
  </div>
</template>
<script>
export default {
  name: 'logo',
  components: {},
  data() {
    return {}
  },
  props: ['show'],
  computed: {},
  created() {},
  mounted() {},
  methods: {
    go_to_page01() {
      this.$router.push('/')
    },
  },
}
</script>
<style scoped lang='less'>
.l_s {
  margin-left: -7px !important;
  letter-spacing: 1px !important;
}
#logo {
  width: fit-content;
  display: flex;
  align-items: center;
  > img {
    width: 44px;
    margin-right: 6px;
  }
  > section {
    > p:nth-child(1) {
      > span:first-child {
        font-family: logo_font;
      }
      display: flex;
      align-items: center;
      font-size: 18px;
      font-weight: normal !important;
      letter-spacing: 0px;
      color: #ffffff;
      > span:nth-child(2) {
        transform: scale(0.9);
        text-align: center;
        display: inline-block;
        letter-spacing: 0px;
        width: 42px;
        height: 17px;
        line-height: 15px;
        background-color: #fd7f2c;
        border-radius: 2px;
        font-size: 12px;
        margin-left: 1px;
        margin-top: -3px;
      }
    }
    > p:nth-child(2) {
      transform: scale(0.8);
      margin-left: -11px;
      margin-top: -5px;
      //   font-family: logo_font;
      font-size: 10px;
      letter-spacing: 4.8px;
      color: #ffffff;
    }
  }
}
</style>